import { defineComponent } from 'vue'
import pageStyle from './styles/macHeader.module.scss'
export default defineComponent({
  props: {
    title: String,
    isFullscreen: Boolean,
    showFull: {
      type: Boolean,
      default: true,
    },
    showDesc: {
      type: Boolean,
      default: true,
    },
    showClose: {
      type: Boolean,
      default: true,
    },
  },
  emits: ['toggle', 'desc', 'close'],
  setup(props, { emit }) {
    return () => (
      <>
        <div class={`${pageStyle.header}`}>
          <div class="tool"></div>
          <div class="title u-line-1">{props.title}</div>
          <div class="tool flex justify-end">
            {props.showFull && (
              <div
                class="full btn press-down"
                title={props.isFullscreen ? '退出全屏' : '全屏'}
                onClick={() => emit('toggle')}
              >
                <i
                  class={`esayIcon ${
                    props.isFullscreen ? 'esayIcon-tuichuquanping' : 'esayIcon-quanping'
                  }`}
                ></i>
              </div>
            )}
            {props.showDesc && (
              <div class="question btn ml-[10px] press-down" onClick={() => emit('desc')}>
                <i class="esayIcon esayIcon-shuyi_shuoming"></i>
              </div>
            )}
            {props.showClose && (
              <div class="close btn ml-[10px] press-down" onClick={() => emit('close')}>
                <i class="esayIcon esayIcon-guanbi"></i>
              </div>
            )}
          </div>
        </div>
      </>
    )
  },
})
